/**
 * Created by njb on 2017/10/10.
 */
import _ from 'lodash';
import './style.css';
import Data from './data.xml';
import printMe from './print.js';
import { cube } from './math.js';

if (process.env.NODE_ENV !== 'production') {
    console.log('Looks like we are in development mode!');
}

function component() {
    var element = document.createElement('div');
    var btn = document.createElement('button');
    // Lodash, currently included via a script, is required for this line to work
    // Lodash, now imported by this script
    element.innerHTML = _.join(['Hello', 'everyone'], ' ');
    element.classList.add('hello');//添加class类名‘hello’

    btn.innerHTML = 'Click me and check the console!';
    btn.onclick = printMe;
    element.appendChild(btn);

    console.log(Data);

    var elementMath = document.createElement('pre');
    elementMath.innerHTML = [
        'Hello webpack!',
        '5 cubed is equal to ' + cube(6)
    ].join('\n\n');

    return elementMath;
}
// document.body.appendChild(component());
let element = component(); // 当 print.js 改变导致页面重新渲染时，重新获取渲染的元素
document.body.appendChild(element);

// function getComponent() {
//     // return import(/* webpackChunkName: "lodash" */ 'lodash').then(_ => {
//     //     var element = document.createElement('div');
//     //     element.innerHTML = _.join(['Hello', 'webpack'], ' ');
//     //     return element;
//     // }).catch(error => 'An error occurred while loading the component');
//     var element = document.createElement('div');
//     const _ = await import(/* webpackChunkName: "lodash" */ 'lodash');
//     element.innerHTML = _.join(['Hello', 'webpack'], ' ');
//     return element;
// }
// getComponent().then(component => {
//    document.body.appendChild(component);
// })

if (module.hot) {
    module.hot.accept('./print.js', function() {
        console.log('Accepting the updated printMe module!');
        // printMe();
        document.body.removeChild(element);
        element = component(); // 重新渲染页面后，component 更新 click 事件处理
        document.body.appendChild(element);
    })
}